<template>
  <div>
    <div class="search">
      <img src="@as/img/sousuo.png" alt="">
      <form action="javascript:;" @submit="submit">
            <input v-model="value" type="search" placeholder="搜索名字/拼音/手机号码/党内职务/组织">
      </form>
    </div>
    <ul class="memberList">
      <li @click="goInfo(item.id)" v-for="(item,index) in list" :key="index">
        <img :src="item.photo" alt="">
        <span>{{item.name}}</span>
      </li>
    </ul>
  </div>
</template>

<script>

  export default {
    data () {
      return {
        value:'',
        list:[]
      }
    },
    created() {
      this.getMemberList(this.$route.query.id)
    },
      mounted(){
        this.$progress.done();
      },
    methods: {
      submit(){
        this.$router.push({path: '/mine/PartyMemberManagement/search', query: {value:this.value}})
      },
      goInfo(id){
        this.$router.push({path: '/mine/memberInfo',query: {id:id}})
      },
      getMemberList(id){
        const url = `app/Party/party_list`
        let params = {
          org_ID: id
        }
        this.$http.get(url, params).then(res=>{
          this.list = res.data
        })
      }
    },
    components: {

    }
  }
</script>

<style lang="scss" scoped>
input[type="search"]::-webkit-search-cancel-button{
    display: none;
}
.search{
  position: relative;
  box-sizing: border-box;
  display: block;
  width:343px;
  height:40px;
  margin: 25px auto 20px;
  img{
    width:14px;
    height:14px;
    position: absolute;
    left: 10px;
    top: 13px;
  }
  input{
    -webkit-appearance: none;
    box-sizing: border-box;
    padding: 0 32px;
    display: block;
    width:343px;
    height:40px;
    line-height: 23px;
    border: 0;
    outline: none;
    background:rgba(221,221,221,.3);
    border-radius:6px;
    font-size:13px;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(204,204,204,1);
  }
}
.memberList{
  width: 100%;
  box-sizing: border-box;
  padding-left: 34px;
  li{
    display: flex;
    width: 100%;
    box-sizing: border-box;
    height: 70px;
    line-height: 70px;
    border-bottom: 1PX solid rgba(221,221,221,.5);
    padding-left: 8px;
    align-items: center;
    &:last-of-type{
      border:0
    }
    img{
      width:40px;
      height:40px;
      background:rgba(238,238,238,1);
      border-radius:50%;
      margin-right: 16px;
    }
    span{
      font-size:14px;
      font-family:PingFang-SC-Medium;
      font-weight:500;
      color:rgba(51,51,51,1);
    }
  }
}
</style>

